<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="https://echarts.baidu.com/examples/vendors/bootstrap/css/bootstrap.css">
  <link rel="stylesheet" href="https://echarts.baidu.com/examples/stylesheets/main.css?_v_=1548453451319">
</head>

<body>
  <div id="main-container">
    <div id="main" style="height:400px;"></div>
  </div>
</body>
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
<script src="https://echarts.baidu.com/examples/vendors/jquery/jquery.js"></script>
<script src="https://echarts.baidu.com/examples/vendors/bootstrap/js/bootstrap.js"></script>
<script src="https://echarts.baidu.com/examples/vendors/echarts/echarts.min.js?_v_=1548453451319"></script>
<script>
  function chart(arr) {
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));
    // 指定图表的配置项和数据
    var option = {
      xAxis: {
        type: 'category',
        // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
      },
      yAxis: {
        type: 'value',
        data:['15000','12000','10000','6666']
      },
      series: [{
        data: arr,
        type: 'line'
      }]
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }

  let arr=[]
  function getData() {
    axios.get('./dist/history.json').then(res => {
      res.data.forEach(item => {
        arr.push(parseInt(item.account))
      })
      chart(arr)
    })
  }
  getData()

</script>

</html>
